<section class="session-top">
    <ion-header translucent="false">
        <ion-toolbar style="--background: transparent;margin-top: -44px;">
            <ion-buttons *ngIf="!tagData.data?.hideCloseBtn" slot="start" appDebounceClick (debounceClick)="close()">
                <img class="header-icon-img" src="assets/img/close.png" alt="back" 
                [ngStyle]="tagData.data?.hideCloseImgCssStyle|styleFilter">
            </ion-buttons>
            <ion-buttons *ngIf="tagData.data?.hideCloseBtn" slot="end" appDebounceClick (debounceClick)="close()">
                <span [ngStyle]="tagData.data?.hideCloseBtnCssStyle|styleFilter">{{tagData.data?.hideCloseBtn}}</span>
            </ion-buttons>
        </ion-toolbar>
    </ion-header>
    <ng-container *ngIf="tagData.data.bookInfo">
        <div class="img-bg">
            
            <ng-container *ngIf="tagData.data.useNewIconUrl; else isNotNewIconUrlTemplate">
                <img class="res-icon" src="{{tagData.data.iconName}}" onerror="this.src='assets/icon/pay_icon_success@3x.png'" alt="">
            </ng-container>
            <ng-template #isNotNewIconUrlTemplate>
                <img class="res-icon" src="assets/icon/{{tagData.data.iconName}}"
                onerror="this.src='assets/icon/pay_icon_success@3x.png'"
                alt="">
            </ng-template>
        
        
        </div>
        <p class="res-title">{{tagData.data.title}}</p>
        <ion-grid class="grid-padding">
            <ion-row class="ion-align-items-start">
                <ion-col class="" *ngFor="let itemInfo of tagData.data.bookInfo; let i=index" offset="0" size="12">
                    <ng-container *ngIf="itemInfo.content != null || itemInfo.value != undefined">
                        <p class="item-label"> {{itemInfo.label}}</p>
                        <p class="item-value">{{itemInfo.content}}</p>
                        <div style="clear: both;"></div>
                    </ng-container>
                </ion-col>
            </ion-row>
        </ion-grid>
        <div class="btn-bg">
            <button class="finish-btn"
                appDebounceClick (debounceClick)="finishBtn(tagData.data?.finishButton)">{{tagData.data?.finishButton?.label}} </button>
            <button class="save-btn" appDebounceClick (debounceClick)="saveBtn(tagData.data.saveButton)">
                {{tagData.data.saveButton.label}}</button>
        </div>
    </ng-container>
    <ng-container *ngIf="tagData.data.paymentInfo">
        <div class="img-bg">
            
            <ng-container *ngIf="tagData.data.useNewIconUrl; else isNotNewIconUrlTemplate">
                <img class="res-icon" src="{{tagData.data.iconName}}" onerror="this.src='assets/icon/pay_icon_success@3x.png'" alt="">
            </ng-container>
            <ng-template #isNotNewIconUrlTemplate>
                <img class="res-icon" src="assets/icon/{{tagData.data.iconName}}"
                onerror="this.src='assets/icon/pay_icon_success@3x.png'"
                alt="">
            </ng-template>
        
        
        </div>
        <p class="res-title">{{tagData.data.title}}</p>
        <p class="res-subTitle" *ngIf="tagData.data.subTitle1" [ngStyle]="tagData.data.subTitle1CssStyle|styleFilter">
            {{tagData.data.subTitle1}}</p>
        <p class="res-subTitle" *ngIf="tagData.data.subTitle2" [ngStyle]="tagData.data.subTitle2CssStyle|styleFilter">
            {{tagData.data.subTitle2}}</p>
        <p class="res-subTitle" *ngIf="tagData.data.subTitle3" [ngStyle]="tagData.data.subTitle3CssStyle|styleFilter">
            {{tagData.data.subTitle3}}
            <span class="title" *ngIf="tagData.data.subTitle4"
                [ngStyle]="tagData.data.subTitle4CssStyle|styleFilter">{{tagData.data.subTitle4}}</span>
            {{tagData.data.subTitle5}}
        </p>
        <div class="resContent" *ngIf="!tagData.data.hiddenPaymentInfo">
            <ng-container *ngFor="let it of tagData.data.paymentInfo">
                <span [ngStyle]="it.labelCssStyle|styleFilter">{{it.label}}<font
                        [ngStyle]="it.contentCssStyle|styleFilter">{{it.content}}</font></span>
            </ng-container>
        </div>
        <div class="btn-bg">
            <!--1.9.0 改动 5.0 新增按钮样式-->
            <button class="finish-btn" *ngIf="tagData.data?.finishButton"
                [ngStyle]="tagData.data?.finishButtonCssStyle|styleFilter"
                appDebounceClick (debounceClick)="finishBtn(tagData.data?.finishButton)">{{tagData.data?.finishButton?.label}}
            </button>
            <button *ngIf="tagData.data?.saveButton" class="save-btn"
                [ngStyle]="tagData.data?.saveButtonCssStyle|styleFilter"
                appDebounceClick (debounceClick)="saveBtn(tagData.data?.saveButton)">{{tagData.data?.saveButton?.label}}</button>
        </div>
    </ng-container>
    <ng-container *ngIf="tagData.data.enterButton">

        <div class="img-bg">

            <ng-container *ngIf="tagData.data.useNewIconUrl; else isNotNewIconUrlTemplate">
                <img class="res-icon" src="{{tagData.data.iconName}}" onerror="this.src='assets/icon/pay_icon_success@3x.png'" alt="">
            </ng-container>
            <ng-template #isNotNewIconUrlTemplate>
                <img class="res-icon" src="assets/icon/{{tagData.data.iconName}}"
                onerror="this.src='assets/icon/pay_icon_success@3x.png'"
                alt="">
            </ng-template>
            
            
        
        </div>
        <p class="res-title" [ngClass]="{'has-tips': tagData.data.tips !== undefined}">{{tagData.data.title}}</p>
        <p class="res-tips">{{tagData.data.tips}}</p>
        <div class="btn-bg">
            <button class="sure-btn" appDebounceClick (debounceClick)="sureBtn(tagData.data.enterButton)">{{tagData.data.enterButton.label}}
            </button>
        </div>
    </ng-container>

    <hr *ngIf="!tagData?.data?.hidenBottomLine" class="sepline">
</section>

<!-- {
  "type": "tag",
  "style": "xxxx",
  "name": "xxxx",
  "data": {
      "iconName": "xxx.png",
      "watermark":"ppp.png",
      "title": "支付成功 | 支付失败",
      "tips": "您的选址信息已失效",
      "bookInfo": [{
          "label": "购买服务",
          "content": "铺铺旺选址通会员服务（服务一个月）"
      }, {
          "label": "支付金额",
          "content": "3580元"
      }, {
          "label": "支付时间",
          "content": "2017-10-10 12:30"
      }, {
          "label": "交易单号",
          "content": "2017101008088888888"
      }],
      "finishButton": {
          "label": "完成",
          "link": {
              "type": "page",
              "target": "pageId",
              "params": {}
          }
      },
      "enterButton": {
          "label": "确定",
          "link": {
              "type": "page",
              "target": "pageId",
              "params": {}
          }
      },
      "saveButton": {
          "label": "保存支付凭证"
      }
  }
} -->